<template>
  <a-menu mode="horizontal" v-model:selectedKeys="selectRoute" @click="navigate">
    <a-menu-item key="Home">博客主页</a-menu-item>
    <a-menu-item key="TimeLine" disabled>时间线</a-menu-item>
    <a-menu-item key="OpenSource" disabled>开源项目</a-menu-item>
    <a-menu-item key="Message" disabled>留言</a-menu-item>
    <a-menu-item key="About" disabled>关于</a-menu-item>
  </a-menu>
</template>

<script setup>
import {useRoute, useRouter} from "vue-router";

const route = useRoute()
const router = useRouter()

const selectRoute = [route.name]
const navigate = to => {
  const targetRouter = router.getRoutes().find(i => i.name === to.key)
  if (!router) return
  router.push(targetRouter.path)
}
</script>

<style scoped>

</style>